import { lazy, Suspense } from 'react'
import { Spin } from 'antd'
import { Router, Route, Switch, Redirect } from 'react-router-dom'
import { AuthRoute } from '@/components/AuthRoute'
import { history } from '@/utils'
import './App.scss'
const layout = lazy(() => import('./pages/layout'))
const Login = lazy(() => import('./pages/Login'))
const NodFount = lazy(() => import('./pages/NodFount'))
// import layout from './pages/layout'
// import Login from './pages/Login'
// import NodFount from './pages/NodFount'

function App() {
  return (
    <Router history={history}>
      <Suspense
        fallback={
          <div className="loading">
            <Spin tip="加载中..." />{' '}
          </div>
        }
      >
        <div className="app">
          <Switch>
            <Route exact path="/" render={() => <Redirect to="/login" />} />

            <AuthRoute path="/home" component={layout}></AuthRoute>
            <Route path="/login" component={Login}></Route>
            <Route>
              <NodFount />
            </Route>
          </Switch>
        </div>
      </Suspense>
    </Router>
  )
}

export default App
